<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
    <meta content="telephone=no" name="format-detection"/>
    <meta content="address=no" name="format-detection"/>
    <meta name="msapplication-tap-highlight" content="no" />
    <title>使用SVG实现奥运五环</title>
    <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js"></script>
</head>
<body>
<svg width="450" height="300" xmlns="http://www.w3.org/2000/svg">
    <g stroke-width="10" fill="none">
        <circle stroke="#0085c7" r="50" cy="117" cx="105"/>
        <circle stroke="#000000" r="50" cy="117" cx="220"/>
        <circle stroke="#df0024" r="50" cy="117" cx="335"/>
        <circle stroke="#f4c300" r="50" cy="172" cx="162"/>
        <circle stroke="#009f3d" r="50" cy="172" cx="278"/>
    </g>
    <g stroke-width="10" fill="none">
        <line stroke="#000000" x1="270" y1="116" x2="268" y2="132"/>
        <line stroke="#0085c7" x1="156" y1="116" x2="153" y2="130"/>
        <line stroke="#df0024" x1="317" y1="163" x2="335" y2="168"/>
        <line stroke="#000000" x1="204" y1="165" x2="218" y2="168"/>        
    </g>
</svg>
</body>
</html>